<template>
	<div class="scroll" ref="scroll">
		<div id="wrapper">
			<slot></slot>
		</div>
	</div>
</template>

<script>
	import BScroll from 'better-scroll';
	export default {
		name:'scroll',
		props:{
			probeType:Number,
			pullUpLoad:{
				type:Boolean,
				default:false
			}
		},
		data(){
			return {
				scroll:{}
			}
		},
		mounted() {
			//设置实例
			this.scroll = new BScroll(this.$refs.scroll,{
				click:true,
				probeType:this.probeType,
				pullUpLoad:this.pullUpLoad
			}),
			//监听滚动事件
			this.scroll.on('scroll',(position)=>{
				this.$emit('scroll',position.y);
			}),
			//监听上拉加载更多
			this.scroll.on('pullingUp',()=>{
				this.$emit('pullingUp');
			}),
			this.scroll.on('scrollEnd',(position)=>{
				this.$emit('scrollEnd',position.y)
			})
		},
		methods:{
			refresh(){
				this.scroll.refresh()
			}
		}
	}
</script>

<style>
	.scroll{
		height: 100vh;
	}
</style>
